<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style rel="stylesheet">
        .redClass{
            color: red;
        }
    </style>
    <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
</head>
<body>
    <div id="app">
        <!--阻止a标签默认行为-->
        <a href="http://www.baidu.com" @click.prevent="btnClick">点我</a>
        <!--https://cn.vuejs.org/v2/guide/events.html-->


    </div>


    <script>
       // document.getElementById("app").innerHtml="";

        //1,构建Vue实例
        var app =  new Vue({
            el:"#app",//容器的id
            data:{ //定义数据
                username:"",
                flag:false,
                msg:""
            },
            methods:{

                btnClick(){
                    alert('我被点了');
                }
            }

        });

    </script>

</body>
</html>